<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <title>title</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" href="../css/aui.css" />
    <link rel="stylesheet" href="../css/mui.css" />
    <link rel="stylesheet" href="../css/public-head.css" />
    <link rel="stylesheet" type="text/css" href="../css/ServiceCompletion.css" />
</head>

<body>
    <div class="Zhangice">
        <div class="background">
            <img src="../image/icon/bj-rwwc@2x.png">
        </div>

        <div class="bacek">
            <!--顶部钥匙柜图-->
            <div><img src="../image/icon/fccxysg@2x.png" /></div>
            <div>
                <p id="key_Cabinet">钥匙柜 QWWD-01</p>
                <p id="Key_Cabinet_num">取钥码:157628</p>
            </div>
        </div>
        <div class="suspension">
            <div class="supen">
                <div class="supen-1">感谢您对车车侠的信任，期待再次光临</div>
                <div class="supen-2">
                    <!-- <div class="but-1">申请售后</div>
                    <div class="but-2">打赏技师</div> -->
                    <div class="but-3" onclick="toEvaluate()">去评价</div>

                </div>
            </div>
        </div>
        <div class="express-1" id="order1">
            <!-- <div class="list">
                <form id="list-outside">
                    <div class="outside">
                        <div>服务方式</div>
                        <div>智能存取</div>
                    </div>

                    <div class="outside">
                        <div>存钥密码</div>
                        <div>951627</div>
                    </div>

                    <div class="outside">
                        <div>钥匙柜</div>
                        <div>QXWD-01</div>
                    </div>

                    <div class="outside">
                        <div>洗车券</div>
                        <div>0</div>
                    </div>

                    <div class="outside">
                        <div>代金券</div>
                        <div>0</div>
                    </div>

                    <div class="outside">
                        <div>支付方式</div>
                        <div>微信支付</div>
                    </div>

                    <div class="outside">
                        <div>下单时间</div>
                        <div>2018-11-27 19:07:24</div>
                    </div>
                    <div class="outside">
                        <div>存钥时间</div>
                        <div>2018-11-27 19:07:24</div>
                    </div>
                    <div class="outside">
                        <div>订单号</div>
                        <div>100023870087879</div>
                    </div>
                    <div class="outside">
                        <div></div>
                        <div class="money">实付￥<span>35.0</span></div>
                    </div>
                </form>
            </div> -->
        </div>

        <div class="express-2" id="order3">
            <!-- <div class="list">
                <form id="list-outside">
                    <div class="outside">
                        <div>服务技师</div>
                        <div>张三</div>
                    </div>

                    <div class="outside">
                        <div>服务网点</div>
                        <div>万达银座停车场负二楼门店</div>
                    </div>

                    <div class="outside">
                        <div>取钥匙时间</div>
                        <div>2018-11-01 19:08:39</div>
                    </div>

                    <div class="outside">
                        <div>验车</div>
                        <div>2018-11-01 19:08:39</div>
                    </div>

                    <div class="outside">
                        <div>质检</div>
                        <div>2018-11-01 19:08:39</div>
                    </div>

                    <div class="outside">
                        <div>施工用时</div>
                        <div>00:30:00</div>
                    </div>

                    <div class="outside">
                        <div>存钥匙时间</div>
                        <div>2018-11-27 19:07:24</div>
                    </div>

                    <div class="outside">
                        <div>车辆位置</div>
                        <div>方正小区负一楼停车场A11</div>
                    </div>
                </form>
                <div class="bott">
                    <div class="bott-1"></div>
                    <div class="bott-2">
                        <div><img src="../image/icon/ddwc@2x.png" /></div>
                        <div>您的订单已完成~</div>
                    </div>
                    <div class="bott-3"></div>
                </div>

            </div> -->
        </div>
    </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/public-head.js"></script>
<script type="text/javascript" src="../script/aui-slide.js"></script>
<script type="text/javascript" src="../script/aui-tab.js"></script>
<script type="text/javascript" src="../script/mui.js"></script>
<script type="text/javascript" src="../script/rem.js"></script>
<script type="text/javascript" src="../script/template-web.js"></script>
<script type="text/html" id="order_templet1">
    <div class="list">
        <form id="list-outside">
            <div class="outside">
                <div>{{data.clean_order.plate_number}}</div>
                <div></div>
            </div>
            <div class="outside">
                <div>服务方式</div>
                {{if data.order_type=="self"||data.order_type=="key"}}
                <div>智能存取</div>
                {{else if data.order_type=="master"}}
                <div>技师下单</div>
                {{else if data.order_type=="shops"}}
                <div>到店下单</div>
                {{/if}}
            </div>
            {{if data.keyCabinet.keycabinet_sn !=null}}
            <div class="outside">
                <div>钥匙柜</div>
                <div>{{data.keyCabinet.keycabinet_sn}}</div>
            </div>
            {{/if}}
            {{if data.coupon_id>0}}
            <div class="outside">
                <div>{{data.coupon_name}}</div>
                <div>{{data.coupon_amount}}</div>
            </div>
            {{/if}}

            <div class="outside">
                <div>支付方式</div>
                {{if data.pay_way=="alipay"}}
                <div>支付宝支付</div>
                {{else if data.pay_way=="wechat"}}
                <div>微信支付</div>
                {{/if}}
            </div>

            <div class="outside">
                <div>下单时间</div>
                <div>{{data.created_at}}</div>
            </div>
            <div class="outside">
                <div>订单号</div>
                <div>{{data.order_sn}}</div>
            </div>
            <div class="outside">
                <div>取钥码</div>
                <div style="color:blue">{{data.keyCabinet.user_pickcode}}</div>
            </div>
            <div class="outside">
                <div></div>
                <div class="money">实付￥<span>{{data.pay_amount}}</span></div>
            </div>
        </form>
    </div>
    <div style="width: 100%;height: 8px;background-color: #EEEEEE;"> </div>
</script>
<script type="text/html" id="order_templet3">
    <div class="list">
        <form id="list-outside">
            <div class="outside">
                <div>服务技师</div>
                <div>{{data.clean_order.master.real_name}}</div>
            </div>

            <div class="outside">
                <div>服务网点</div>
                <div>{{data.clean_order.shop.shop_name}}</div>
            </div>
            {{each data.flows as val i}} {{if val.step_desc=="技师已接单"}}
            <div class="outside">
                <div>接单时间</div>
                <div>{{val.created_at}}</div>
            </div>
            {{/if}} {{if val.step_desc=="已提交验车报告"}}
            <div class="outside">
                <div>验车</div>
                <div>{{val.created_at}}</div>
            </div>
            {{/if}} {{if val.step_desc=="已提交质检报告"}}
            <div class="outside">
                <div>质检</div>
                <div>{{val.created_at}}</div>
            </div>
            {{/if}} {{if val.step_desc=="等待客户取车中"}}
            <div class="outside">
                <div>存钥匙时间</div>
                <div>{{val.created_at}}</div>
            </div>
            {{/if}} {{/each}}

            <div class="outside">
                <div>车辆位置</div>
                <div>{{data.clean_order.parking_space}}</div>
            </div>
        </form>
        <div class="bott">
            <div class="bott-1"></div>
            <div class="bott-2">
                <div><img src="../image/icon/ddwc@2x.png" /></div>
                <div>您的订单已完成~</div>
            </div>
            <div class="bott-3"></div>
        </div>

    </div>
</script>
<script type="text/javascript">
    apiready = function() {
        console.log(JSON.stringify(api.pageParam.orderInfo));
        fnorderInfor()
    }
    headInner({
            title: "服务完成",
            //headleft
            headl: '<a href="#" style="color:white" class="mui-icon mui-icon-left-nav" tapmode onclick="api.closeWin()"></a>',
            //headright
            headr: '完成',
            // <div class="icon"><img src="../image/icon/fenxiang@2x.png"/></div><div class="icon"><img src="../image/icon/shaoma@2x.png"/></div>
            color: "transparent", //默认是蓝色
            padding: "0px 0px 0px",
        })
        /*//发生滚动时给头部颜色，浏览器有效果手机上没有
		var header = document.querySelector('.public-head');
		document.documentElement.scrollTop = 100;
    var num = 0;
    window.onscroll = function(){
        num = document.documentElement.scrollTop;
        header.style.background = 'transparent';
        if(num>100){
            header.style.background = '#0A5AFA';
        }else{
            header.style.background = 'transparent';
        }
    }
*/
    function fnorderInfor() {
        if (api.pageParam.orderID == undefined) {
            BASE.MYajax({
                'pathName': 'order/getOrder',
                'ajaxData': {
                    values: {
                        orders_id: api.pageParam.orderInfo.id
                    }
                },
                'method': Infor_back
            });
        } else {
            BASE.MYajax({
                'pathName': 'order/getOrder',
                'ajaxData': {
                    values: {
                        orders_id: api.pageParam.orderID
                    }
                },
                'method': Infor_back
            });
        }
    }

    function Infor_back(ret, err) {
        if (ret.code == 200) {
            console.log('Infor_back '+JSON.stringify(ret));

            var html = template("order_templet1", ret);
            console.log('order_templet1 ' + html);
            $api.byId('order1').innerHTML = html;
            var orderHtml = template("order_templet3", ret);

            $api.byId('order3').innerHTML = orderHtml;
            var keyCabinet  = ret.data.keyCabinet
            if (keyCabinet.keycabinet_sn) {
              $api.byId('key_Cabinet').innerHTML = "钥匙柜" + keyCabinet.keycabinet_sn;
              $api.byId('Key_Cabinet_num').innerHTML = "取钥码" + keyCabinet.user_pickcode;
            }

        } else {
            reToast(ret, err)
        }
    }

    function toEvaluate() {
        api.openWin({
            name: 'service-evaluation',
            url: '../html/service-evaluation.html',
            pageParam: {
                orderInfo: api.pageParam.orderInfo
            }
        });

    }

    function mine_2() {
        api.openWin({
            name: 'mine_2',
            url: '../html/mine_2.html'
        });
    }
</script>

</html>
